<template>
  <div class="cateStrBar pad t-center">
    <outer-box >
      <el-form ref="liveActivityForm" class="liveActivityForm" :rules="ruleInfo" :model="list" label-width="80px">
        <el-form-item label="标题" prop="title">
          <el-input v-model="list.title" :placeholder="ruleInfo.title[0].message" />
        </el-form-item>

        <el-form-item label="分类" prop="cateTags">
          <Cascader :value.sync="list.cateTags" :children="'sub'" :list="classifyList" :placeholder="ruleInfo.cateTags[0].message"/>
          <!-- <el-cascader
            v-model="list.cateTags"
            :options="classifyList"
            ref='cateTagsCascader'
            :props="{ multiple: true, checkStrictly: true ,label:'tagsName',value:'tagsId',children:'sub'}"
            clearable

          /> -->
        </el-form-item>
        <el-form-item label="标签" prop="colTags">
         <!-- <el-cascader
            v-model="list.colTags"
            ref='colTagsCascader'
            :options="tagsList"
            :placeholder="ruleInfo.colTags[0].message"
            :props="{ multiple: true, checkStrictly: true ,label:'groupName',value:'groupId',children:'sub'}"
            clearable
          /> -->
          <Cascader :value.sync="list.colTags" :children="'sub'" :list="tagsList" :placeholder="ruleInfo.colTags[0].message"/>
        </el-form-item>

        <el-form-item label="会议人数" prop="quorum" v-if="title.indexOf('会议')>-1">
          <el-input
            v-model="quorum"
            placeholder="请输入会议人数"
          />
        </el-form-item>
        <el-form-item label="时间" prop="startTime">
          <el-date-picker
            v-model="timeRange"
            type="datetimerange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            value-format="yyyy-MM-dd HH:mm:ss"
          />
        </el-form-item>
        <el-button @click="submitFrom">发布</el-button>
      </el-form>
    </outer-box>
  </div>
</template>

<script>
import outerBox  from '@/components/outerBox'
import { findColumnList, findTagsList } from '@/api/basic'
import { findIdToName } from '@/utils/cateTagColumn'
import Cascader from '@/components/Cascader'
export default {
  name: 'AddLiveActyForm',
  props:['title','list','classifyListArr'],
  data(){
    return {
      quorum:this.list.quorum,
      timeRange:[],
      parntClassifyList:this.classifyListArr,
      stepList:[],
      isLive:false,
      classifyList:[],
      ruleInfo:{
        "cateTags": [{required:false,message:'请输入分类'}
        ],
        "colTags": [{required:false,message:'请输入标签'}
        ],
        "endTime": [{required:true,message:'请输入结束时间'}],

        "startTime": [{required:true,message:'请输入开始时间'}],

        "title": [{required:true,message:'请输入标题'}]
      }

    }
  },
  components:{
    outerBox,
    Cascader
  },
  watch:{
  quorum(val){
    this.list.quorum = val
  },
  classifyListArr(){
   this._findColumnList()
    this._findTagsList()
  },
    title(name){
     // if(name){
     //   this.list.stepTypeEnum =  name==='添加在线课程'?'LIVE':'MEETING'
     // }
     this.isLive = name === '添加在线课程'
    },
    ['list.startTime'](t){
      if(!t){
        this.timeRange = []
      }
    },
    timeRange(timer){
      this.list.startTime = timer[0]
      this.list.endTime = timer[1]
      this.$emit('update:list',this.list)
    },
  },
  computed: {
    tagsList(){
      return this.$store.state.app.WEB_CAST
    }
  },
   created(){
     this._findColumnList()
      this._findTagsList()
      console.log("实打实的",this.$parent)
    },
    methods: {
      async _findColumnList() {
        const params = this.parntClassifyList
        const res = await findColumnList(params)
        this.classifyList = res.data
      },
      async _findTagsList() {
        const params = {
          tagsBizEnum: "WEB_CAST", //教案
          ...this.parntClassifyList
        };
        this.$store.dispatch("app/_cateTagsGroupFindList", params);
        //this.tagsList = res.data
        // console.log(this.tagsList)
      },
    submitFrom(){
      this.$refs['liveActivityForm'].validate((valid) => {
                if (valid) {
                 this.list.stepTypeEnum =  this.stitle==='添加在线课程'?'LIVE':'MEETING'
                 console.log("李斯特",this.list)
                 //this.title.indexOf('在线课程')>-1
                 // var b = {
                 //   "cateTags": this.list.cateTags,
                 //   "colTags": this.list.colTags,
                 //   "endTime":  this.list.endTime,
                 //   //"quorum":  this.list.quorum,
                 //   quorum:Number(this.list.quorum),
                 //   "startTime":  this.list.startTime,
                 //   // "stepId":  this.list.,

                 //   "title":  this.list.title
                 // }
                   
                 var b= Object.assign({},{...this.list, "stepTypeEnum": this.title==='添加在线课程'?'LIVE':'MEETING'})

                  var nameCateTagsList = findIdToName(this.list.cateTags,this.classifyList,'sub','tagsId','tagsName')
                  var namecolTagsList = findIdToName(this.list.colTags,this.tagsList,'sub','groupId','groupName')
                  var cateTagsCascader =  this.$refs.cateTagsCascader
                  var colTagsCascader  = this.$refs.colTagsCascader
                  console.log("dsa ",nameCateTagsList,namecolTagsList)

                 this.$emit('addActivityLiveFn',b,Object.assign({},{...b,cateTags:nameCateTagsList,colTags:namecolTagsList}))
                } else {
                  console.log('error submit!!');
                  return false;
                }
              });

     }
  }
}
</script>
<style lang="scss">

</style>
<style scoped>

</style>
